<template>
    <div class="list">
        <table class="list-table">
            <tbody>
            <tr v-for="item in listData">
                <td width="30%">{{ item.title }}</td>
                <td width="70%">{{ item.value }}</td>
            </tr>
            <tr></tr>
            </tbody>
        </table>
    </div>
</template>
<script>
    export default {
        props: ["listData"]
    }
</script>
<style>
    .list-table {
        width: 100%;
        display: table;
        border-collapse: collapse;
        border-spacing: 2px;
        border: solid #dfe6ec 1px;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .list-table tbody tr td {
        border-bottom: 1px solid #dfe6ec;
        border-right: 1px solid #dfe6ec;

        padding: 5px;
    }

    .list-table tbody tr:last-of-type td {
        border-bottom: none;
    }
</style>